$(function(){
	$('.ul-img-box').find('img').click(function(){
		$(this).removeClass('active').parent().siblings().find('img').addClass('active');
		$('.img-box').attr('src',$(this).attr('src'));
	})
	
	$('#left').click(function(){
		var width = $('.img-item-box').width();
		var ul_width = $('.ul-img-box').width();
		num = ul_width - width
		if($('.ul-img-box').css('margin-left') != '0px'){
			$('.ul-img-box').css('margin-left','0px')
		}
	})
	
	$('#right').click(function(){
		var width = $('.img-item-box').width();
		var ul_width = $('.ul-img-box').width();
		num = width-ul_width
		if($('.ul-img-box').css('margin-left') == '0px'){
			$('.ul-img-box').css('margin-left',num+'px')
		}
	})
	
})